<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <script src="https://cdn.bootcdn.net/ajax/libs/axios/0.27.2/axios.min.js"></script>
</head>
<body>
  <h1>passport</h1>
  <input type="text" id="account"/>
  <input type="password" id="password"/>
  <button onclick="login()">login</button>
  <button onclick="getCookies()">get cookies</button>
  <script>
    function getCookies () {
      axios({
        method: 'post',
        url: '/api/getCookies'
      }).then(res => {
        alert(JSON.stringify(res.data.data))
      })
    }

    function login() {
      const account = document.querySelector('#account').value
      const password = document.querySelector('#password').value
      axios({
        method: 'post',
        url: '/api/login',
        data: {
          account,
          password
        }
      }).then(res => {
        alert(res.data.message)
      }).catch(err => {
        alert(JSON.stringify(err))
      })
    }
  </script>
</body>
</html>
